/*------------------------------------*
    #GRID
/*------------------------------------*

$susy: (columns: 12, container: 1920px, gutters: 1/4, use-custom:(box-sizing: false))

.container
  +container

.container-fluid
  width: 100%

.col-1
  @include span(1 of 12)

.col-2
  @include span(2 of 12)

.col-3
  @include span(3 of 12)

.col-4
  @include span(4 of 12)

.col-5
  @include span(5 of 12)

.col-6
  @include span(6 of 12)

.col-7
  @include span(7 of 12)

.col-8
  @include span(8 of 12)

.col-9
  @include span(9 of 12)

.col-10
  @include span(10 of 12)

.col-11
  @include span(11 of 12)

.col-12
  @include span(12 of 12)

.col-last
  @include last()

.col-pull-1
  +pull(1 of 12)

.col-pull-2
  +pull(2 of 12)

.col-pull-3
  +pull(3 of 12)

.col-pull-4
  +pull(4 of 12)

.col-pull-5
  +pull(5 of 12)

.col-pull-6
  +pull(6 of 12)

.col-pull-7
  +pull(7 of 12)

.col-pull-8
  +pull(8 of 12)

.col-pull-9
  +pull(9 of 12)

.col-pull-10
  +pull(10 of 12)

.col-pull-11
  +pull(11 of 12)

.col-pull-12
  +pull(12 of 12)

.col-push-1
  +push(1 of 12)

.col-push-2
  +push(2 of 12)

.col-push-3
  +push(3 of 12)

.col-push-4
  +push(4 of 12)

.col-push-5
  +push(5 of 12)

.col-push-6
  +push(6 of 12)

.col-push-7
  +push(7 of 12)

.col-push-8
  +push(8 of 12)

.col-push-9
  +push(9 of 12)

.col-push-10
  +push(10 of 12)

.col-push-11
  +push(11 of 12)

.col-push-12
  +push(12 of 12)

.clearfix
  &:before,
  &:after
    content: ''
    display: table
  &:after
    clear: both

.debug
  & [class*="col-"]
    display: table
    height: 50px
    padding: $padding-base-vertical $padding-base-horizontal
    background-color: rgba(lighten(#000, 35%), .2)
    &::before
      display: table-cell
      content: attr(class)
      vertical-align: middle
      font-size: $font-size-base
      word-break: break-all
